.listbox{
	background: #f9f9f9;
	.aiyou-list{
		font-size: 14px;
		color: #333;
		.allkind{
			a{
				font-size: 14px;
				color: #333;
				padding: 10px 0;
				&.allkind-left{
					float: left;
				}
				&.allkind-right{
					float: right;
				}
				i.icon-del{
					display: inline-block;
					background: url(../images/iconlist.png) no-repeat;
					width: 14px;
				    height: 16px;
				    background-position: 0 -14px;
				    vertical-align: middle;
				    margin-right: 5px;
				}
			}	
		}
		.filter-box {
			border: 1px solid #e0e0e0;
    		background-color: #fff;
    		.filter-nav{
    			height: 40px;
			    line-height: 40px;
			    border-bottom: 1px solid #e0e0e0;
    			ul{
	    			li{
	    				float: left;
					    border-right: 1px solid #ededed;
						height: 40px;
	    				a {
	    					display: block;
						    padding: 0 30px;
						    border-bottom: 1px solid transparent;
						    height: 37px;
						    line-height: 34px;
						    color: #333;
						    &.active {
						    	border-color: #3cb43c;
							    line-height: 35px;
							    background-color: #fafafa;
							    height: 40px;
							    position: relative;
						    }
	    				}
	    			}
	    		}
    		}
	    	.filter-item{
	    		padding: 0 30px;
	    		.item-group{
	    			padding: 8px 0;
	    			border-bottom: 1px dotted #e0e0e0;
	    			.item-title{
	    				float: left;
	    				line-height: 28px;
	    				color: #999;
					    width: 75px;
					    text-align: right;
					    margin-right: 10px;
	    			}
	    			a{
	    				color: #333;
	    				padding: 0 5px;
	    				line-height: 28px;
	    				margin-right: 5px;
	    				&:hover{
	    					color: #3cb43c;
	    				}
	    				&.active{
	    					color: #fff;
	    					background: #3cb43c;
	    				}

	    			}
	    		}
	    		.otherkind{
	    			display: none;
	    		}
	    		.showallbtn{
	    			text-align: center;
	    			padding: 10px 0;
	    			a {
	    				cursor: pointer;
	    				i{
		    				background: url(../images/iconlist.png) 0 0 no-repeat;
	    					display: inline-block;
						    width: 11px;
						    height: 11px;
						    vertical-align: middle;
						    &.up{
						    	background-position: 0 -57px;
						    }
						    &.down{
						    	background-position: 0 -72px;
						    }
		    			}
		    			span{
		    				display: inline-block;
		    				height: 20px;
						    line-height: 20px;
						    text-align: center;
						    color: #808080;
						    font-size: 12px;
		    			}
	    			}	
	    		}
	    	}	
		}
		.list-main {
			margin: 25px 0; 
			.list-left {
				width: 870px;
			    margin-right: 20px;
			    float: left;
			    .filter-sort {
			    	background: #fff;
			    	a {
			    		display: inline-block;
			    		border-right: 1px solid #e0e0e0;
    					padding: 10px 24px;
    					font-size: 12px;
    					color: #333;
			    	}
			    }
			    .list-product {
			    	.product-group {
			    		margin: 20px 0;
					    background-color: #fff;
					    height: 240px;
					    box-shadow: 0 0 5px #c6c6c6;
			    		.product-img {
			    			float: left;
			    			margin-right: 30px;
			    			position: relative;
			    			width: 240px;
			    			height: 240px;
		    				img {
			    				width: 240px;
			    				height: 240px;
			    			}
			    			i{
			    				background: url(../images/iconlist.png) no-repeat;
			    				display: inline-block;
			    				background-position: 0 -96px;
							    width: 40px;
							    height: 28px;
							    line-height: 20px;
							    font-size: 12px;
							    color: #fff;
							    text-align: center;
							    position: absolute;
							    left: 15px;
			    			}
			    		}
			    		.product-title {
		    				font-size: 18px;
		    				line-height: 24px;
		    				padding-top: 15px;
		    				padding-bottom: 40px;
		    			}
			    		.product-info{
			    			padding-right: 25px;
			    			float: left;
			    			.base-left{
			    				width: 400px;
			    				float: left;
			    				margin-right: 30px;
				    			.base-con {
				    				color: #808080;
				    				font-size: 12px;
				    				height: 24px;
				    				line-height: 24px;
				    				overflow: hidden;
				    				.icon {
			    					    display: inline-block;
									    height: 24px;
									    width: 24px;
									    background: url(../images/iconlist.png) no-repeat;
									    background-position: -57px -89px;
									    vertical-align: top;
				    				}
				    			}
				    			.base-data{
				    				margin-top: 10px;
				    				padding-top: 10px;
				    				border-top: 1px solid #e0e0e0;
				    				.start-box {
				    					padding: 5px 0;
				    					span{
				    						color: #808080;
				    						font-size: 12px;
				    						margin-right: 30px;
				    						i.icon{
				    							display: inline-block;
											    width: 20px;
											    height: 20px;
											    vertical-align: top;
											    background: url(../images/iconlist.png) no-repeat;
											    margin-right: 5px;
											    &.icon-place {
											    	background-position: 0 -140px;
											    }
											    &.icon-by {
											    	background-position: -30px -139px;
											    }
				    						}
				    					}
				    					span.strength{
				    						i{
				    							display: inline-block;
											    width: 10px;
											    height: 3px;
											    background-color: #e0e0e0;
											    margin-right: 2px;
											    vertical-align: top;
											    margin-top: 9px;
											    &.on{
											    	background-color: #f19149;
											    }
				    						}
				    					}
				    				}
				    				.start-time {
				    					padding: 5px 0;
			    					    height: 20px;
										line-height: 20px;
										font-size: 12px;
										color: #808080;
				    					i.icon-calendar{
				    						display: inline-block;
										    width: 20px;
										    height: 20px;
										    vertical-align: top;
				    						background: url(../images/iconlist.png) no-repeat;
				    						background-position: -64px -139px;
				    					}
				    				}
				    			}
			    			}
				    		.base-right {
				    			float: right;
				    			width: 145px;
				    			.price-box {
				    				span{
				    					color: #808080;
				    					position: relative;
				    					top: 10px;
				    				}
				    				.price {
				    					float: right;
				    					color: #f97700;
				    					font-size: 14px;
				    					&:before{
				    						content: '￥';
				    					}
				    					em{
				    						font-size: 30px;
				    						color: #f97700;
				    					}
				    					i{
				    						color: #808080; 
				    					}
				    				}
				    			}
				    			.enrollbtn{
				    				display: block;
								    line-height: 35px;
								    color: #fff;
								    background-color: #f97700;
								    text-align: center;
								    margin-top: 15px;
				    			}
				    			.total{
				    				margin-top: 20px;
				    				p {
				    					float: left;
				    					width: 72px;
				    					text-align: center;
									    height: 20px;
									    line-height: 20px;
									    em{
									    	color: #dcdcdc;
									    }
									    i {
									    	display: inline-block;
									    	width: 20px;
										    height: 20px;
										    vertical-align: top;
										    background: url(../images/iconlist.png) no-repeat;
										    &.heart{
										    	    background-position: -74px 5px;
										    }
										    &.eye{
										    	    background-position: -76px -14px;
										    }
									    }
				    				}
				    			}
				    		}	
			    		}
			    	}
			    }
			}
			.list-right {
				width: 280px;
				overflow: hidden;
				a{
					display: block;
					margin-bottom: 20px;
				}
			}
		}
	}
}